<!--
 * @Author: zhuxiaoyi
 * @Date: 2023-12-21 10:16:46
 * @LastEditor: zhuxiaoyi
 * @LastEditTime: 2023-12-21 15:32:52
 * @Description: 
-->
<template>
    <el-row>
        <el-col :span="24">
            <div class="labeling-container">
                <el-table :data="dimension" style="width: 100%" :border="true" :max-height="viewHeight - 150">
                    <el-table-column prop="number" label="number" />
                    <el-table-column prop="label" label="label" />
                    <el-table-column prop="range" label="range" />
                    <el-table-column prop="name" label="name" />
                    <el-table-column  label="img" :align="'center'">
                        <template #default="scope">
                            <el-popover placement="right" :width="1200" trigger="click">
                            <template #reference>
                                <el-button type="primary"> 成果查看</el-button>
                            </template>
                            <el-image v-if="scope.row.img=='1.png'"  :src="png1"  />
                            <el-image v-if="scope.row.img=='2.png'"  :src="png2"  />
                            <el-image v-if="scope.row.img=='3.png'"  :src="png3"  />
                        </el-popover>
                        </template>
                        
                    </el-table-column>
                </el-table>
            </div>
        </el-col>
    </el-row>
</template>
<script setup>
import { defineComponent, reactive, ref, toRefs, onMounted, watch } from "vue";
import png1 from './img/1.png'
import png2 from './img/2.png'
import png3 from './img/3.png'
let viewHeight = ref(window.innerHeight);
let viewwidth = ref(window.innerWidth);

let dimension = [
    {
        number: "T1",
        label: "水文模型",
        range: "57 64",
        name: "VIC水文模型",
        img: "1.png",
    },
    {
        number: "T2",
        label: "流域",
        range: "65 69",
        name: "滦河流域",
        img: "1.png",
    },
    {
        number: "T3",
        label: "流域",
        range: "343 347",
        name: "滦河流域",
        img: "1.png",
    },
    {
        number: "T4",
        label: "水文模型",
        range: "305 342",
        name: "VIC(variableinfiltrationcapacity)水文模型",
        img: "1.png",
    },
    {
        number: "T5",
        label: "自然人",
        range: "145 147",
        name: "陈宏",
        img: "1.png",
    },
    {
        number: "T6",
        label: "机构",
        range: "174 180",
        name: "天津市气象台",
        img: "1.png",
    },
    {
        number: "T7",
        label: "时间",
        range: "420 430",
        name: "1971—1979年",
        img: "1.png",
    },
    {
        number: "T8",
        label: "水文要素",
        range: "518 521",
        name: "月径流",
        img: "1.png",
    },
    {
        number: "T9",
        label: "水文模型",
        range: "1362 1372",
        name: "VIC分布式水文模型",
        img: "1.png",
    },
    {
        number: "T10",
        label: "流域",
        range: "1373 1377",
        name: "滦河流域",
        img: "1.png",
    },
    {
        number: "T11",
        label: "时间",
        range: "1840 1850",
        name: "1971—2000年",
        img: "1.png",
    },
    {
        number: "T12",
        label: "监测站点",
        range: "1850 1855",
        name: "滦县水文站",
        img: "1.png",
    },
    {
        number: "T13",
        label: "流域",
        range: "1946 1950",
        name: "滦河流域",
        img: "1.png",
    },
    {
        number: "T14",
        label: "水文模型",
        range: "3522 3527",
        name: "VIC模型",
        img: "1.png",
    },
    {
        number: "T15",
        label: "指标名称",
        range: "6160 6164",
        name: "相关系数",
        img: "1.png",
    },
    {
        number: "T16",
        label: "数值",
        range: "6165 6168",
        name: "89%",
        img: "1.png",
    },
    {
        number: "T17",
        label: "指标名称",
        range: "6102 6108",
        name: "Nash系数",
        img: "1.png",
    },
    {
        number: "T18",
        label: "数值",
        range: "6109 6113",
        name: "0.79",
        img: "1.png",
    },
    {
        number: "T19",
        label: "指标名称",
        range: "6114 6118",
        name: "相对误差",
        img: "1.png",
    },
    {
        number: "T20",
        label: "数值",
        range: "6119 6121",
        name: "3%",
        img: "1.png",
    },
    {
        number: "T21",
        label: "水文模型",
        range: "52 60",
        name: "垂向混合产流模型",
        img: "2.png",
    },
    {
        number: "T22",
        label: "流域",
        range: "61 66",
        name: "大凌河流域",
        img: "2.png",
    },
    {
        number: "T23",
        label: "自然人",
        range: "73 75",
        name: "蔡涛",
        img: "2.png",
    },
    {
        number: "T24",
        label: "机构",
        range: "76 82",
        name: "辽宁省水文局",
        img: "2.png",
    },
    {
        number: "T25",
        label: "水文模型",
        range: "102 110",
        name: "垂向混合产流模型",
        img: "2.png",
    },
    {
        number: "T26",
        label: "流域",
        range: "156 161",
        name: "大凌河流域",
        img: "2.png",
    },
    {
        number: "T27",
        label: "指标名称",
        range: "245 251",
        name: "平均相对误差",
        img: "2.png",
    },
    {
        number: "T28",
        label: "指标名称",
        range: "259 264",
        name: "确定性系数",
        img: "2.png",
    },
    {
        number: "T29",
        label: "指标名称",
        range: "287 293",
        name: "平均相对误差",
        img: "2.png",
    },
    {
        number: "T30",
        label: "指标名称",
        range: "301 306",
        name: "确定性系数",
        img: "2.png",
    },
    {
        number: "T31",
        label: "流域",
        range: "353 358",
        name: "大凌河流域",
        img: "2.png",
    },
    {
        number: "T32",
        label: "水文模型",
        range: "590 598",
        name: "垂向混合产流模型",
        img: "2.png",
    },
    {
        number: "T33",
        label: "流域",
        range: "650 655",
        name: "大凌河流域",
        img: "2.png",
    },
    {
        number: "T34",
        label: "监测站点",
        range: "987 993",
        name: "大城子水文站",
        img: "2.png",
    },
    {
        number: "T35",
        label: "水文模型",
        range: "1087 1095",
        name: "垂向混合产流模型",
        img: "2.png",
    },
    {
        number: "T36",
        label: "水文模型",
        range: "1268 1279",
        name: "改进的垂向混合产流模型",
        img: "2.png",
    },
    {
        number: "T37",
        label: "水文模型",
        range: "92 98",
        name: "HSPF模型",
        img: "3.png",
    },
    {
        number: "T38",
        label: "流域",
        range: "248 252",
        name: "中河流域",
        img: "3.png",
    },
    {
        number: "T39",
        label: "自然人",
        range: "107 110",
        name: "李金城",
        img: "3.png",
    },
    {
        number: "T40",
        label: "机构",
        range: "129 141",
        name: "云南大学生态学与环境学院",
        img: "3.png",
    },
    {
        number: "T41",
        label: "指标名称",
        range: "333 337",
        name: "纳什系数",
        img: "3.png",
    },
    {
        number: "T42",
        label: "指标名称",
        range: "343 347",
        name: "可决系数",
        img: "3.png",
    },
    {
        number: "T43",
        label: "数值",
        range: "352 361",
        name: "0.65～0.78",
        img: "3.png",
    },
    {
        number: "T44",
        label: "水文模型",
        range: "650 658",
        name: "HSPF水文模型",
        img: "3.png",
    },
    {
        number: "T45",
        label: "水文要素",
        range: "292 294",
        name: "流量",
        img: "3.png",
    },
    {
        number: "T46",
        label: "水文模型",
        range: "998 1006",
        name: "HSPF水文模型",
        img: "3.png",
    },
    {
        number: "T47",
        label: "流域",
        range: "1019 1023",
        name: "中河流域",
        img: "3.png",
    },
    {
        number: "T48",
        label: "时间",
        range: "1028 1038",
        name: "2007～2014年",
        img: "3.png",
    },
    {
        number: "T49",
        label: "水文模型",
        range: "1100 1110",
        name: "HSPF流域水文模型",
        img: "3.png",
    },
    {
        number: "T50",
        label: "流域",
        range: "1137 1141",
        name: "中河流域",
        img: "3.png",
    },
    {
        number: "T51",
        label: "水文要素",
        range: "696 700",
        name: "径流模拟",
        img: "3.png",
    },
];
</script>

<style lang="scss" scoped>
.labeling-container {
    width: 100%;
    box-sizing: border-box;
    padding: 40px;
}
</style>
<style lang="scss"></style>
